<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: zjd
  Date: 2020/8/24
  Time: 11:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <title>图表统计页面</title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/back-style/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/back-style/css/bootstrap-responsive.min.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/back-style/css/matrix-style.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/back-style/css/matrix-media.css"/>
    <link href="${pageContext.request.contextPath}/back-style/font-awesome/css/font-awesome.css" rel="stylesheet"/>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,800' rel='stylesheet' type='text/css'>
</head>
<body>

<!--Header-part-->
<div id="header">
    <h1><a href="dashboard.html">MatAdmin</a></h1>
</div>
<!--close-Header-part-->

<!--top-Header-menu-->
<div id="user-nav" class="navbar navbar-inverse">

</div>

<!--start-top-serch-->
<!--close-top-serch-->

<!--sidebar-menu-->

<div id="sidebar"><a href="#" class="visible-phone"><i class="icon icon-signal"></i> Charts &amp; graphs</a>
    <ul>
        <li><a href="${pageContext.request.contextPath}/admin/toUsersList"><i class="icon icon-home"></i>
            <span>首页</span></a></li>
        <li><a href="${pageContext.request.contextPath}/admin/toAddMovies"><i class="icon icon-signal"></i>
            <span>添加电影</span></a></li>
        <li><a href="${pageContext.request.contextPath}/admin/toMoviesDetail"><i class="icon icon-inbox"></i>
            <span>电影详情</span></a></li>
        <li class="active"><a href="${pageContext.request.contextPath}/admin/toCharts"><i class="icon icon-th"></i>
            <span>图表</span></a></li>
        <li><a href="${pageContext.request.contextPath}/admin/toAdminList"><i class="icon icon-fullscreen"></i> <span>管理列表</span></a>
        </li>
        <li><a href="${pageContext.request.contextPath}/admin/toAddShowing"><i class="icon icon-fullscreen"></i> <span>添加场次</span></a>
        </li>
        <li><a href="${pageContext.request.contextPath}/admin/toShowingList"><i class="icon icon-fullscreen"></i> <span>全部场次</span></a>
        </li>
        <li><a href="${pageContext.request.contextPath}/admin/toAddCinemas"><i class="icon icon-fullscreen"></i> <span>添加放映厅</span></a>
        </li>
        <li><a href="${pageContext.request.contextPath}/admin/toCinemasList"><i class="icon icon-fullscreen"></i> <span>全部放映厅</span></a>
        </li>
        <li><a href="${pageContext.request.contextPath}/admin/toAddType"><i class="icon icon-fullscreen"></i> <span>添加展厅类型</span></a>
        </li>
        <li><a href="${pageContext.request.contextPath}/admin/toAddCate"><i class="icon icon-fullscreen"></i> <span>电影类型添加</span></a>
        </li>
    </ul>
</div>
<div id="content">
    <div id="content-header">
        <h1>图表</h1>
    </div>
    <div class="span2"></div>
    <div class="span4">
        <div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div>
    </div>
    <div class="span2"></div>
    <div class="span4">
        <div id="container1" style="width: 550px; height: 400px; margin: 0 auto"></div>
    </div>
</div>
</div>
<!--Footer-part-->
<div class="row-fluid">
    <div id="footer" class="span12">Copyright &copy; 2018.Company name All rights reserved.<a target="_blank"
                                                                                              href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a>
    </div>
</div>
<!--end-Footer-part-->
<!--Real-time-chart-js-->

<!--Turning-series-chart-js-->
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/data.js"></script>
<script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
<script>
    $(function () {
        var ctext = new Array();
        var score = new Array();
        $.post("${pageContext.request.contextPath}/comments/avgAll",
            {},
            function (data) {
                $.each(data, function (index, obj) {
                    for (var i = 0; i < data.length; i++) {
                        ctext[i] = data[i].movieName;
                        if (data[i].movieScore == null) {
                            score[i] = 0;
                        } else {
                            score[i] = parseFloat(data[i].movieScore);
                        }
                    }
                })
                var option = {
                    chart: {
                        /*renderTo: 'container',*/
                        type: 'column' //显示类型 柱形
                    },
                    title: {
                        text: '电影评分' //图表的标题
                    },
                    xAxis: {
                        categories: ctext
                    },
                    yAxis: {
                        min: 0,
                        title: {
                            text: '平均', //Y轴的名称
                        }
                    },
                    series: [{
                        name: "电影名",
                        data: score
                    }]
                }
                $("#container").highcharts(option)
                /*var chart = new Highcharts.Chart("container",option);*/
            }, "json")

    });
    var d_x = new Array();
    var d_y = new Array();
    $.post("${pageContext.request.contextPath}/orders/queryAllCount", {},
        function (data) {
            for (var i = 0; i < data.length; i++) {
                d_x[i] = data[i].movieName;
                d_y[i] = data[i].showing_count;
            }
            var option1 = {
                chart: {
                    /*renderTo: 'container',*/
                    type: 'column' //显示类型 柱形
                },
                title: {
                    text: '电影场次' //图表的标题
                },
                xAxis: {
                    categories: d_x
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: '场次', //Y轴的名称
                    }
                },
                series: [{
                    name: "电影名",
                    data: d_y
                }]
            }
            $("#container1").highcharts(option1)
        }, "json")
</script>
</body>
</html>
